*{
	margin: 0;
	padding: 0;
}
		#lianxi{
			position: absolute;
			top: 10%;
			left: 38%;
			background-color: whitesmoke;
			width: 400px;
			height: 300px;
			z-index: 25;
		}
		#heng{
			background-color: lightgray;
			color: black;
			font-size: 16px;
			font-weight: 500;
			text-align: center;
			width: 400px;
			height: 30px;
			line-height: 30px;
		}
		#lianxi>img{
			display: block;
			margin: 0 auto;
		}
		#cover{
			position: absolute;
			background-color: black;
			opacity: 0.8;
			height: 100%;
			width: 100%;
			z-index: 25;
		}
		.guanbi{
			cursor: pointer;
			margin-right: 5px;
			font-size: 25px;
			float: right;
		}
		.guanbi:hover{
			color: orange;
		}


@font-face { 
	font-family: HanDingFanTeLi;
	src: url('../HanDingFanTeLi/HanDingFanTeLi-2.ttf');
} 
body{
	background-color: deepskyblue;
	background-image: linear-gradient(to right, deepskyblue, whitesmoke);
}
.fade{
	opacity: 0;
}
.show{
	opacity: 1;
}
.hidden{
	display: none;
}

#redRoll{

}

#Box{
	position: relative;
	top: 50px;
	margin: 0 auto;
	width: 1088px;
	height: 600px;
	border-radius: 10px;
	/* border: 1px solid black; */
}
#left{
	border-radius: 10px;
	float: left;
	display: inline-block;
	width: 780px;
	height: 600px;
	/* border: 1px solid black; */
}
#right{
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	background-color: white;
	position: relative;
	float: left;
	display: inline-block;
	width: 304px;
	height: 600px;
	/* border: 1px solid black; */
}
#Title{
	text-align: center;
	color: dimgray;
	position: absolute;
	top: 20px;
	left: 25px;
	font-size: 55px;
	font-family: "HanDingFanTeLi";
}
#ChangeTitle{
	font-family: 'Courier New', Courier, monospace;
	font-weight: 600;
	position: absolute;
	top: 180px;
	left: 55px;
}
#nowTitle{
	color: royalblue;
}

#ChangeSign{
	color: royalblue;
	cursor: pointer;
	font-size: 20px;
}
#ChangeSign:hover{
	cursor: point;
	color: orange !important;
}
#ChangeRegi{
	color: darkgray;
	cursor: pointer;
	font-size: 20px;
}
#ChangeRegi:hover{
	cursor: point;
	color: orange !important;
}
#Signin{
	position: absolute;
	left: 40px;
	top:240px;
}
#forget{
	position: absolute;
	left: 88px;
	bottom: -50px;
}
#forget>span{
	transition: 0.5s;
	cursor: pointer;
	color: darkgray;
	font-size: 14px;
}
#forget>span:hover{
	color: orangered;
}

#Register{
/* 	display: none; */
	position: absolute;
	left: 40px;
	top:240px;
}
input{
	color: gray;
	font-size: 16px;
	margin-top: 40px;
	width: 200px;
	height: 35px;
	outline: none;
	opacity: 1;
	border: none;
}
#item{
	position: relative;
	border-bottom: 2px solid rgb(181, 154, 254);
}
label{
	color: gray;
	font-size: 16px;
	font-weight: 500;
}
#user{
	position: absolute;	
	bottom: 5px;
}
#pwd{
	position: absolute;
	bottom: 5px;
}
.bottom-line{
	position: absolute;
	width: 0;
	height: 2px;
	left:0;
	bottom: -1px;
	background-color: red;
}
#button{
	border-radius: 20px;
	color: darkgray;
	margin-left: 85px;
	transition: 1s;
	font-size: 16px;
	color: black;
	display: inline-block;
	width: 70px;
	height: 40px;
}
#button:hover{
	color: white;
	background-color: orange;
}
#Lback{
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	width: 100%;
	height: 100%;
}